import React from 'react';
import Total from './Total';

class App extends React.Component {

    constructor(props) {
        console.error("constructor");
        super(props);
        this.state = {
            count: 0
        }
    }

    increment = () => {
      this.setState({
          count: ++this.state.count
      })
    }

    decrement = () => {
      this.setState({
          count: --this.state.count
      })
    }

    componentWillMount() {
      console.error("componentWillMount");
    }

    componentDidMount() {
      console.error("componentDidMount");
    }

    shouldComponentUpdate () {
      console.error("app shouldComponentUpdate");
      return true;
    }

    componentWillUpdate() {
        console.error("app componentWillUpdate");
    }

    componentDidUpdate() {
        console.error("app componentDidUpdate");
    }

    render() {
        return (
          <div className="App">
              <button onClick={ this.increment }>+</button>
              <button onClick={ this.decrement }>-</button>
              <span>count: { this.state.count }</span>
              <Total total={ this.state.count } />
              <Total total={ 0 } />
          </div>
        );
    }
}

export default App;
